DOCS/Scalable and Interactive Segmentation and Visualization of Neural Processes in EM Datasets_files/preloaderWidget.js

   1 jQuery(function($) {
   2     $.widget("ncbi.preloaderWidget", {
   3
   4         options: {
   5             url: '/static/header_footer_ajax/',
   6             //url: '/sites/NCBI_SSI_Components@2.29/header_footer_ajax/',
   7             footerSelector: '.subfooter',
   8             footerPreloadPos: 500,
   9             menuSelectors: {
  10                 '#resource-menu': 'resources-menu',
  11                 '#all-howtos-menu': 'howto-menu'
  12             }
  13         },
  14
  15         /**
  16             Private variables
  17          */
  18         _browserHeight: null,
  19         _footerOffset:  null,
  20
  21
  22         _init: function()
  23         {
  24             var self = this;
  25
  26             // Only one instance of this plugin is allowed
  27             if (this.instance())
  28             {
  29                 return false;
  30             }
  31
  32             this.updateUrlFromMeta();
  33
  34             /*$.each(self.options.menuSelectors, function(selector, url) {
  35                 self.initMenu(selector, url);
  36             });*/
  37
  38             self.initFooter();
  39         },
  40
  41         /**
  42          * Check for instance of the plugin
  43          */
  44         instance: function()
  45         {
  46             var instance = this.element.data('headerFooterAjaxInstance');
  47             if (typeof instance != "undefined")
  48             {
  49                 return instance;
  50             }
  51
  52             this.element.data('headerFooterAjaxInstance', this);
  53             return false;
  54         },
  55
  56         updateUrlFromMeta: function()
  57         {
  58             var newUrl = $('meta[name="headerFooterUrl"]').attr('content');
  59             if (typeof newUrl == "undefined")
  60             {
  61                 return false;
  62             }
  63
  64             this.options.url = newUrl;
  65             return true;
  66         },
  67
  68         initMenu: function(element, url)
  69         {
  70             var menuitem = $(element).find('a');
  71
  72             // Do not redirect if top level menu item clicked
  73             menuitem.on('click', function(e) {
  74                 e.preventDefault();
  75                 e.stopPropagation();
  76             });
  77
  78             // Preload menu
  79             menuitem.on('mouseenter.preload focus.preload', { element: menuitem, url: this.options.url + url }, this.preloadMenu);
  80
  81         },
  82
  83         preloadMenu: function(event)
  84         {
  85             var element = event.data.element;
  86
  87             /**
  88                 Load menu items and add them after main link
  89              */
  90             $.get(event.data.url + '?p$debugoutput=none', function(data) {
  91                 element.after(data);
  92             }, 'html');
  93
  94             /**
  95                 Once submenu is loaded - we are done, disconnect events
  96              */
  97             element.off('mouseenter.preload focus.preload');
  98
  99             /**
 100                 Menu is supposed to appear when keyboard focus is received.
 101                 But it has just been loaded, so trigger "focus" again
 102              */
 103             if (event.type == 'focus')
 104             {
 105                 element.trigger('focus');
 106             }
 107         },
 108
 109         initFooter: function()
 110         {
 111             var footer = $(this.options.footerSelector);
 112             var scrollTop = $(document).scrollTop();
 113
 114             // Footer not found
 115             if (footer.length < 1)
 116             {
 117                 return false;
 118             }
 119
 120             this._browserHeight = $(window).height();
 121             this._footerOffset = footer.offset().top;
 122
 123             /**
 124                 Load footer if it is visible
 125                 (page height is less than browser height or page is scrolled to the footer)
 126              */
 127                 if(this._footerOffset < scrollTop + this._browserHeight + 500)
 128                 {
 129                         this.loadFooter(footer);
 130                 }
 131                 /* Otherwise wait for user to scroll to the bottom */
 132                 else
 133                 {
 134                         $(window).on('scroll', { self: this, container: footer }, this.lazyLoadFooter);
 135                 }
 136         },
 137
 138         loadFooter: function(container)
 139         {
 140                 container.load(this.options.url + "footer-menu" + '?p$debugoutput=none', function() {
 141                     /* Add popup for external links (facebook, twitter, youtube) */
 142                     container.find('a').ncbiexternallink();
 143 /*                  jQuery.ui.jig.scan('body', {
 144                         widgets: ['ncbiexternallink']
 145
 146                     });*/
 147                 });
 148         },
 149
 150         lazyLoadFooter: function(event)
 151         {
 152             var self = event.data.self;
 153             var scrollTop = $(document).scrollTop();
 154             if(scrollTop + self._browserHeight > self._footerOffset - self.options.footerPreloadPos)
 155             {
 156                         self.loadFooter(event.data.container);
 157                         $(window).unbind("scroll", self.lazyLoadFooter);
 158                 }
 159         }
 160
 161
 162
 163     });
 164
 165     // Initialize widget
 166     $(document).preloaderWidget();
 167 });
 168
 169
 170